import { Component, EventEmitter } from '@angular/core';
import { ActionSheetController, IonicPage, NavController, NavParams } from 'ionic-angular';
import { NativeService } from '../../providers/NativeService';
import { FileObj } from './FileObj';
import { Camera, CameraOptions } from '@ionic-native/camera';
/**
 * Generated class for the PhotoPage page.
 *
 * See https://ionicframework.com/docs/components/#navigation for more info on
 * Ionic pages and navigation.
 */

@IonicPage()
@Component({
	selector: 'page-photo',
	templateUrl: 'photo.html'
})
export class PhotoPage {
	max = 4; // 最多可选择多少张图片，默认为4张

	allowAdd = true; // 是否允许新增
	e: any;
	allowDelete = true; // 是否允许删除

	fileObjList: FileObj[] = []; // 图片列表,与fileObjListChange形成双向数据绑定
	fileObjListChange = new EventEmitter<any>();
	imgsrc = '../assets/imgs/noimg.jpg';
	constructor(
		private actionSheetCtrl: ActionSheetController,
		public navCtrl: NavController,
		public navParams: NavParams,
		private nativeService: NativeService,
		private camera: Camera
	) {}
	options: CameraOptions = {
		quality: 100,
		sourceType: this.camera.PictureSourceType.CAMERA,
		destinationType: this.camera.DestinationType.DATA_URL,
		encodingType: this.camera.EncodingType.JPEG,
		mediaType: this.camera.MediaType.PICTURE
	};
	ionViewDidLoad() {
		console.log('ionViewDidLoad PhotoPage');
	}
	onChange(event) {
		// var that = this;
		// var files = event.target.files,
		// 	file;
		// if (files && files.length > 0) {
		// 	file = files[0];
		// 	var fileReader = new FileReader();
		// 	fileReader.onload = function(e) {
		// 		console.log(e);
		// 		that.e=e;
		// 		var content = that.e.target.result;
		// 		that.imgsrc = content;
		// 	};
		// }
		// fileReader.readAsDataURL(file);
		// this.nativeService.getPicture();
		// this.nativeService.getMultiplePicture();
		// alert("1");
		this.camera.getPicture(this.options).then(
			(imageData) => {
				// 获取成功
				let base64Image = 'data:image/jpeg;base64,' + imageData;
			},
			(err) => {
				console.log('获取图片失败');
			}
		);
	}
	comfirm() {
		alert('1');
		this.nativeService.getPicture();
		console.log(this.nativeService.getPicture());
		this.nativeService.getPicture().subscribe((res) => {
			console.log(res);
		});
	}
	addPicture() {
		// 新增照片
		const that = this;
		that.actionSheetCtrl
			.create({
				buttons: [
					{
						text: '从相册选择',
						handler: () => {
							that.nativeService
								.getMultiplePicture({
									// 从相册多选
									maximumImagesCount: that.max - that.fileObjList.length,
									destinationType: 1 // 期望返回的图片格式,1图片路径
								})
								.subscribe((imgs) => {
									for (const img of imgs as string[]) {
										that.getPictureSuccess(img);
									}
								});
						}
					},
					{
						text: '拍照',
						handler: () => {
							that.nativeService.getPicture().subscribe((img) => {
								that.getPictureSuccess(img);
							});
						}
					},
					{
						text: '取消',
						role: 'cancel'
					}
				]
			})
			.present();
	}
	private getPictureSuccess(img) {
		const fileObj = { origPath: img, thumbPath: img };
		this.fileObjList.push(fileObj);
		this.fileObjListChange.emit(this.fileObjList);
	}
}
